<template>
    <div class="WireropeSelect">
        <MyDialog :model-value="true" title="钢丝绳选择" :type="DialogType.C3" @close="onClose" append-to-body>
            <Wirerope ref="WireropeRef" isSelect divHeight="calc(100vh - 349px)" :checkbox-config="checkboxConfig" :radio-config="radioConfig" @setSelectData="onSetSelectData" v-bind="$attrs"></Wirerope>

            <template #footer>
                <el-button type="primary" plain @click="onOK">确定</el-button>
            </template>
        </MyDialog>
    </div>
</template>

<script lang="ts" setup>
import { DialogType } from "@/_gx/TsEnums";
import Wirerope from "./Wirerope.vue";

//定义2种config
const checkboxConfig = { trigger: "row" };
const radioConfig = { trigger: "row" };

//定义选择的WireropeID，可能是单个值，可能是数组，一般情况是单个值（即如果是单选，则回显时选中；如果是多选，则回显时把数据隐藏）
const selectWireropeID = ref<any>();

//调用已经选择的钢丝绳ID
const SetSelectWireropeID = (wireropeID) => {
    selectWireropeID.value = wireropeID;
};

//设置回显时界面上的选择
const onSetSelectData = () => {
    nextTick(() => {
        WireropeRef.value.WireropeDataTableRef.SetSelectData(selectWireropeID.value);
    });
};

//定义Wirerope的Ref对象
const WireropeRef = ref(null);

//确定
const onOK = () => {
    //得到选择的数据
    let selectData = WireropeRef.value.WireropeDataTableRef.GetSelectData();

    if (Gx.IsEmpty(selectData) || selectData.length == 0) {
        App.Tips({ msg: "未选择任何数据！" });
        return;
    }

    emits("close", selectData);
};

//关闭
const onClose = () => {
    emits("close");
};

const emits = defineEmits(["close"]);
defineExpose({ SetSelectWireropeID });
</script>
